<template>
    <a-form v-bind="attrs" :model="form">
        <a-row :gutter="[8, 8]">
            <a-col v-for="item in children" :key="item.key" :span="span">
                <a-form-item
                    :label="item.attributes.label"
                    :rules="item.attributes.rules"
                >
                    <component
                        :is="item.tag"
                        v-bind="item.attributes"
                        v-model:[item.attributes.model]="
                            form[item.attributes.key]
                        "
                    >
                        {{ item.attributes.content }}
                    </component>
                </a-form-item>
            </a-col>
        </a-row>
    </a-form>
</template>

<script lang="ts">
import { defineComponent, inject, PropType } from "vue";

export default defineComponent({
    props: {
        span: {
            type: Number,
            default: 6,
        },
        form: {
            type: Object,
            required: true,
        },
        children: Array,
    },
    setup(props, { attrs }) {
        try {
            // const golbal = inject<any>("golbal");
            // props.children?.forEach((child) => {
            //     rewriteHookV1(child, golbal.value);
            // });
        } catch (e: any) {
            console.error(e.message);
        }

        return {
            attrs,
        };
    },
});
</script>
